<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta name="renderer" content="webkit" />
    <meta name="force-rendering" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="../css/shop.css">
    <link rel="stylesheet" href="../css/weui.min.css">
    <link rel="stylesheet" href="../css/jquery-weui.min.css">
    <script src="../js/jquery-2.1.4.js"></script>
    <script src="../js/jquery-weui.js"></script>
    <script src="../wxJs/utils/contain.js"></script>
    <script src="../wxJs/utils/storage.js"></script>
    <style>
        .removeT{
           position: absolute;
            width: 100px;
            height: 100%;
            right: 0;
            top: 0;
            color: red;
            font-size: 16px;
            text-align: center;
            line-height: 71px;
            display: none;
            z-index: 9;
        }
        .bank-card{position: relative;}

        .model1 {
            position: fixed;
            top: 0;
            left: 0;
            height: 100%;
            width: 100%;
            background-color: rgba(0, 0, 0, .6);
            display: none;
        }

        .model1 * {
            box-sizing: border-box
        }

        .model1-contain {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-color: #fff;
            border-radius: 8px;
            overflow: hidden
        }

        .model1-title {
            width: 100%;
            background-color: #fff;
            border-bottom: 1px solid #d3d3d3;
            text-align: center;
            padding: 15px 0;
            font-weight: 700;
            line-height: 1
        }

        .model1-content {
            border-top: 1px solid #d3d3d3
        }

        .model1-content input[type='password'] {
            padding: 20px;
            text-align: center;
            cursor: none;
            border: none;
            outline: 0;
            font-size: 18px
        }

        .model1-footer {
            display: flex;
            text-align: center;
            border-top: 1px solid #d3d3d3;
            font-size: 16px
        }

        .model1-footer * {
            flex: 1;
            padding: 10px 0;
            cursor: pointer
        }

        .model1-footer .confirm {
            background-color: #ff9c1c;
            color: #fff
        }
    </style>
</head>

<body>
    <div class="header" style="display: flex">
        <a class="haader-left" href="javascript:window.history.go(-1)"><i class="iconfont icon-left"></i></a>
        <div class="haader-content">银行卡</div>
        <div class="haader-right">

        </div>
    </div>
    <div id="bankList">

    </div>

    <div class="model1">
        <div class="model1-contain">
            <div class="model1-title">支付密码</div>
            <div class="model1-content">
                <input id="code" type="password" placeholder="请输入支付密码" maxlength="6" oninput="setNumType(this)">
            </div>
            <div class="model1-footer">
                <div class="cancel">取消</div>
                <div class="confirm">确认</div>
            </div>
        </div>
    </div>
</body>
<script>
    var shopId  = GetQueryString("shopId")
    var bankId
    var  _this
    var  sysUserId
    var  userInfo
    if (!shopId){
        window.history.back(-1);
    }else {
        $('.haader-right').html('<a href="bank_add.html?shopId='+shopId+'"> <i class="iconfont icon-add"></i></a>')
    }

  $(function () {
      $.post(getWeiContextPath()+"/wx/shop/queryShopBank",{belongId:shopId,belongType:1},function (res) {
          sysUserId =res.sysUserId
          var _bankList = $("#bankList").empty()
          $.each(res.belongBanks,function (i, obj) {
              _bankList.append('<div class="bank-card">\n' +
                  '        <i class="iconfont icon-yinhangqia1"></i>\n' +
                  '        <div class="card-name">'+obj.bankName+'</div>\n' +
                  '        <div class="card-num">'+obj.bankNum+'</div>\n' +
                  '        <div class="removeT" bankId="'+obj.id+'">删除</div>\n' +
                  '    </div>')
          })
          $('.bank-card').on('click',function () {
              $(this).children('.removeT').toggle();
          })

      });


      $('#bankList').on('click','.removeT',function () {
          userInfo =getUserInfo(sysUserId)
          if (!userInfo.payNumber) {
              $.toast("请先设置支付密码", "forbidden")
              return false;
          } else {
              $('.model1').show()
          }
          _this = $(this)
          bankId =  $(this).attr("bankId")
      })
  })
    /*只能输入数字*/
    function setNumType(_this) {
        var num = $(_this).val()
        $(_this).val(num.replace(/[^\d]/g,''))
    }

    $(".cancel").on('click', function () {
        $('.model1').hide()
    })

    /*弹出输入框,判断输入字符返回*/
    $(".confirm").on('click', function () {
        var code = $('#code').val()
        if (!code){
            $.toast("请输入密码", "forbidden")
            return false;
        }
        if (code == userInfo.payNumber) {
            $.post(getWeiContextPath()+"/wx/shop/deleteBank",{bankId:bankId},function(res) {
                if (res.code == 0) {
                    _this.parent().remove()
                    $('.model1').hide()
                }
            })
        } else {
            $.toast("密码错误", "forbidden")
        }
    })
</script>

</html>